<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>定时器</title>
</head>
<body>
<button onclick="funA()">开启定时器1</button>
<button onclick="funB()">停止定时器1</button>
<button onclick="funC()">开启定时器2</button>
<button onclick="funD()">停止定时器2</button>
<hr/>
<span id="s1">0</span>
</body>
</html>
<script>
    let i = 1;
    let timer1, timer2;

    function funA() {
        document.getElementById("s1").innerHTML = i + '';
        i++;
        // 书写一个定时器  1s后执行funA()
        timer1 = setTimeout("funA()", 1000);
    }

    function funB() {
        clearTimeout(timer1)
    }

    function funC() {
        // 书写一个定时器 每隔1s执行funC1()
        timer2 = setInterval("window.funC1()", 1000);
    }

    function funC1() {
       window.document.getElementById("s1").innerHTML = i + '';
        i++;
    }

    function funD() {
        clearInterval(timer2)
    }
</script>